<template>
	<div>
		<div>
			<span><i class="el-icon-search el-icon--right"></i> 筛选查询</span>
			&nbsp;&nbsp;
			登记时间:
			<el-date-picker v-model="startime" type="date" placeholder="选择日期" value-format="yyyy-MM-dd">
			</el-date-picker>&nbsp;到
			<el-date-picker v-model="endtime" type="date" placeholder="选择日期" value-format="yyyy-MM-dd">
			</el-date-picker>
			&nbsp;&nbsp;
			项目:
			<el-select v-model="projectname" placeholder="请选择" clearable>
				<el-option v-for="item in project" :key="item.defectId" :label="item.projectName"
					:value="item.defectId">
				</el-option>
			</el-select>
			&nbsp;&nbsp;
			<el-button @click="Findit" style="margin-left: 200px;">查询<i class="el-icon-search el-icon--right"></i></el-button>
		</div>
		<br>
		<div>
			<!-- 表格展示缺陷 -->
			<el-table ref="multipleTable" :data="defectrecord" tooltip-effect="dark" style="width: 100%">
				<el-table-column prop="defectId" label="编号">
				</el-table-column>
				<el-table-column prop="projectName" label="项目名称">
				</el-table-column>
				<el-table-column prop="defectName" label="缺陷名称" show-overflow-tooltip>
				</el-table-column>
				<el-table-column prop="parentDefectId" label="父缺陷">
					<template slot-scope="scope">
						<span>{{scope.row.parentDefectId==0?'':scope.row.parentDefectId}}</span>
					</template>
				</el-table-column>
				<el-table-column prop="defectPriority" label="优先级">
				</el-table-column>
				<el-table-column prop="defectSevsrity" label="严重程度">
				</el-table-column>
				<el-table-column prop="defectType" label="缺陷类别">
				</el-table-column>
				<el-table-column prop="issueState" label="状态">
				</el-table-column>
				<el-table-column prop="assignee" label="指派">
					<template slot-scope="scope">
						<span>{{scope.row.assignee==null?'暂未指派':scope.row.assignee}}</span>
					</template>
				</el-table-column>
				<el-table-column prop="planEndTime" label="计划完成时间">
				</el-table-column>
				<el-table-column fixed="right" label="操作">
					<template slot-scope="scope">
						<el-button type="text" size="small" @click="GetRecordById(scope.row)">分配</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
		<div>
			<el-dialog title="缺陷分配" :visible.sync="LookMessage" width="25%">
				<el-form ref="form" :model="DefectMessage" label-width="150px">
					<el-form-item label="项目名称:">
						<span>{{DefectMessage.projectName}}</span>
					</el-form-item>
					<el-form-item label="父级缺陷:">
						<span>{{DefectMessage.parentDefectName==null?'无':DefectMessage.parentDefectName}}</span>
					</el-form-item>
					<el-form-item label="缺陷名称:">
						<span>{{DefectMessage.defectName}}</span>
					</el-form-item>
					<el-form-item label="缺陷分类:">
						<span>{{DefectMessage.defectType}}</span>
					</el-form-item>
					<el-form-item label="状态:">
						<span>{{DefectMessage.issueState}}</span>
					</el-form-item>
					<el-form-item label="严重程度:">
						<span>{{DefectMessage.defectSevsrity}}</span>
					</el-form-item>
					<el-form-item label="优先级:">
						<span>{{DefectMessage.defectPriority}}</span>
					</el-form-item>
					<el-form-item label="预期工时:">
						<span>{{DefectMessage.planWorkHours}}</span>
					</el-form-item>
					<el-form-item label="完成率:">
						<span>{{DefectMessage.doneRatio}}%</span>
					</el-form-item>
					<el-form-item label="计划开始时间:">
						<span>{{DefectMessage.planStartTime}}</span>
					</el-form-item>
					<el-form-item label="计划结束时间:">
						<span>{{DefectMessage.planEndTime}}</span>
					</el-form-item>
					<el-form-item label="缺陷描述:">
						<span>{{DefectMessage.defectDesc}}</span>
					</el-form-item>
					<el-form-item label="缺陷要求:">
						<span>{{DefectMessage.doneCondition}}</span>
					</el-form-item>
					<el-form-item label="附件下载:">
						<span><a :href="DefectMessage.attachDesc">{{DefectMessage.attachOldname}}</a></span>
					</el-form-item>
					<el-form-item label="指派:">
						<el-select v-model="name" placeholder="请选择">
							<el-option v-for="item in assignee" :key="item.accountId" :label="item.accountName"
								:value="item.accountName">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<span slot="footer" class="dialog-footer">
					<el-button type="primary" @click="changeassign(DefectMessage.defectId)">确定</el-button>
					<el-button @click="LookMessage = false">取 消</el-button>
				</span>
			</el-dialog>
		</div>
		<div id="DS-Bottom">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="pageInfo.current" :page-sizes="[1, 2, 3, 4]" :page-size="pageInfo.size"
				layout="total, sizes, prev, pager, next, jumper" :total="pageInfo.total">
			</el-pagination>
		</div>
	</div>
</template>

<script>
	export default {
		name: "defectdistribution",
		data() {
			return {
				defectrecord: [],
				current: 1,
				size: 3,
				startime: "",
				endtime: "",
				projectname: "",
				sstate: "",
				DefectMessage: {},
				LookMessage: false,
				assignee: [],
				name: "",
				pageInfo: {},
				project: []
			}
		},
		methods: {
			changeassign(defectId) {
				this.LookMessage=false
				this.$http.post("/defectRecord/changeassignee",{assignee:this.name,defectId:defectId}).then(resp=>{
					if(resp.data.code=200){
						this.$message({
							message:resp.data.message,
							type:'success',
							duration:1000
						})
						this.GetDefectList(this.current, this.size, this.projectname, this.sstate, this.startime, this.endtime);
					}
					
				})
			},
			GetRecordById(defect) {
				console.log(defect);
				
					this.LookMessage = true;
					this.$http.get("/defectRecord/Getassignee",{params:{projectName:defect.projectName}}).then(resp => {
						this.assignee = resp.data.data
					})
					this.$http.post("/defectRecord/GetDefectProjectById", {
						defectId: defect.defectId
					}).then(resp => {
						this.DefectMessage = resp.data.data
						this.name=this.DefectMessage.assignee
					})
				
				
			},
			handleSizeChange(val) {
				this.size = val;
				this.GetDefectList(this.current, val, this.projectname,this.startime, this.endtime);

			},
			handleCurrentChange(val) {
				this.current = val;
				this.GetDefectList(val, this.size, this.projectname,this.startime, this.endtime);
			},
			GetDefectList(current, size, projectname,startime, endtime) {
				this.$http.post("/defectRecord/GetAllDefectRecords", {
					current: current,
					size: size,
					defectId: projectname,
					startime: startime,
					endtime: endtime
				}).then(resp => {
					this.pageInfo = resp.data.data;
					this.defectrecord = resp.data.data.records
				});
			},
			Getinfo() {
				this.$http.get("/defectRecord/GetAllDefectProject").then(resp => {
					this.project = resp.data.data;
				})
			},
			Getassignee() {
				
			},
			Findit(){
				this.GetDefectList(this.current, this.size, this.projectname,this.startime, this.endtime);
			}
		},
		created() {
			this.GetDefectList(this.current, this.size, this.projectname,this.startime, this.endtime);
			this.Getinfo()
			
		}
	}
</script>

<style>
	#DS-Bottom {
		position: absolute;
		text-align: right;
		bottom: 0;
		height: 35px;
		left: 0;
		right: 0;
	}
</style>
